<template>
  <a-card class="ax_sticky_top">
    <template #title>
      <h3 class="text-14">在线用户</h3>
    </template>
    <a-flex justify="space-between" :align="'center'">
      <a-flex :gap="4" :align="'center'">
        <a-input-search
          placeholder="请输入登录地址"
          allow-clear
          @search="onlineList"
          v-model:value="onlineTable.query.ipaddr"
        ></a-input-search>
        <a-input-search
          placeholder="请输入用户名"
          allow-clear
          @search="onlineList"
          v-model:value="onlineTable.query.userName"
        ></a-input-search>
      </a-flex>

      <a-flex>
        <TableField :raw="onlineRawColumns" module-name="online" v-model:columns="onlineColumns" />
        <a-tooltip title="刷新">
          <a-button type="link" @click="onlineList">
            <ReloadOutlined />
          </a-button>
        </a-tooltip>
      </a-flex>
    </a-flex>
  </a-card>
</template>

<script setup lang="ts">
import TableField from '@/views/components/table/Field.vue';
import { ReloadOutlined } from '@ant-design/icons-vue';
import { onlineColumns, onlineRawColumns } from '../data/column';
import { onlineList } from '../data/curd';
import { onlineTable } from '../data/table';
</script>

<style lang="scss" scoped></style>
